/* ------------------------------------------------------ 16:9(标准屏安卓、18:9的浏览器、iphone5/6/7/8，默认css) ------------------------------------------------------*/

.content{width:100%;height:100%;position:relative;margin:0px;padding:0px;overflow: hidden;background:url(../images/bg.jpg) no-repeat center;background-size: cover;}



/*---------------------------------------- 14:9(15:9的浏览器)----------------------*/
@media screen and (device-width:360px) and (min-height:480px) and (max-height:500px){
	
}

/*------------------------------------ 15:9（标准屏+虚拟SYSTEM BAR安卓的微信、16:9的浏览器 、iphone5/6/7/8的微信底部有历史工具条/浏览器）--------------------*/
@media screen and (device-width: 360px) and (min-height: 520px) and (max-height: 540px), screen and (device-width: 320px) and (min-height: 460px) and (max-height: 470px), screen and (device-width: 375px) and (min-height: 550px) and (max-height: 560px), screen and (device-width: 414px) and (min-height: 620px) and (max-height: 630px){
	
}




/*---------------------------------------- 安卓系列----------------------*/
@media screen and (device-width: 360px), screen and (device-width: 393px){
	
}

/*---------------------------------------- iphone系列 ----------------------------------------------*/
@media screen and (device-width: 320px), screen and (device-width: 375px), screen and (device-width: 414px){
.items{width:100%;height:auto;position:relative;margin:0px 0px 10px 0px;padding:0px;overflow:hidden;}
}


/*---------------------------------------- 19:9(刘海屏安卓的微信、iphoneX的微信)----------------------*/
@media screen and (device-width: 360px) and (min-height: 660px), screen and (device-width: 375px) and (min-height: 720px){
	.items{width:100%;height:auto;position:relative;margin:0px 0px 15px 0px;padding:0px;overflow:hidden;}
}
/*------------------------------------- 18:9（全面屏安卓的微信 、iphoneX的微信底部有历史工具条/浏览器）------------------*/
@media screen and (device-width: 360px) and (min-height: 600px), screen and (device-width: 393px) and (min-height: 660px), screen and (device-width: 375px) and (min-height: 630px){
	.items{width:100%;height:auto;position:relative;margin:0px 0px 10px 0px;padding:0px;overflow:hidden;}
}


@media screen and (max-height:850px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 20px 0px;padding:0px;overflow:hidden;}
}

@media screen and (max-height:700px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 10px 0px;padding:0px;overflow:hidden;}
}
@media screen and (width:360px) and (max-height:700px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 20px 0px;padding:0px;overflow:hidden;}
}

	
@media screen and (max-height:610px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 10px 0px;padding:0px;overflow:hidden;}
}
@media screen and (width:360px) and (max-height:610px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 10px 0px;padding:0px;overflow:hidden;}
}

@media screen and (max-height:550px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 5px 0px;padding:0px;overflow:hidden;}
}
@media screen and (width:360px) and (max-height:550px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 5px 0px;padding:0px;overflow:hidden;}
}

@media screen and (max-height:520px){
	
	.items{width:100%;height:auto;position:relative;margin:0px 0px 5px 0px;padding:0px;overflow:hidden;}
}



.gamebox{width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden;
transform-style:preserve-3d;
perspective: 400px;
transform:translate3d(0,0,0);

transform-orgin:50% 50% 350px;
-webkit-transform-orgin:50% 50% 350px;
}

.floorWrapper{width:120%;height:700px;position:absolute;left:-10%;bottom:0;
transform-origin: center bottom;
transform:translate3d(0,0,0) rotateX(55deg);
}
.flooritem{width:100%;height:110px;position:absolute;top:0%;left:50%;background:url(../images/floor.png) no-repeat center;background-size:100% 100%;transform-origin:center top;transform: translate3d(-50%,0,0) scale(1,1);opacity:1;transition: opacity 0.2s;}

.floor1{top:0px;}
.floor2{top:90px;}
.floor3{top:180px;}
.floor4{top:270px;}
.floor5{top:360px;}
.floor6{top:450px;}

/*135*/
.animal{width:60px;height:70px;position:absolute;bottom:155px;left:50%;transform:translate3d(-50%,0%,0) rotateX(0deg);z-index:10;} /*bottom:130px;*/
.animalItem{width:100%;height:100%;position:absolute;top:0;left:0;}

.zaw{width:80px;height:auto;position:absolute;left:20%;bottom:50%;
transform-style:preserve-3d;
perspective: 400px;
transform-origin: center bottom;
transform:translate3d(0,0,0) rotateX(0deg) rotateY(0deg) rotateZ(-8deg);
}


 


